<script setup>
import { onLoad } from '@dcloudio/uni-app'
import request from '@/utils/request'
import API from '@/utils/API'
import { ref } from 'vue'

const noticeInfo = ref({})

const getWallNewsDetail = async (id) => {
	const { data } = await request({
		url: API.getWallNewsDetail,
		data: {
			id
		}
	})
	
	console.log(data)
	noticeInfo.value = data
}

onLoad((options) => {
	getWallNewsDetail(options.id)
})
</script>

<template>
	<view class="noticeLayout">
		<view class="title">
			<view class="tag">
				<uni-tag inverted text="置顶" type="error" />
			</view>
			<view class="font">{{ noticeInfo.title }}</view>			
		</view>
		
		<view class="info">
			<view class="item">{{ noticeInfo.author }}</view>					
			<view class="item">
				<uni-dateformat :date="noticeInfo.publish_date" format="yyyy-MM-dd hh:mm:ss"></uni-dateformat>
			</view>	
		</view>
		
		
		<view class="content" v-html="noticeInfo.content" />
		
		<view class="count">
			阅读 {{ noticeInfo.view_count }}
		</view>
	</view>
</template>

<style scoped lang="scss">
.noticeLayout{
	padding:30rpx;
	
	.title{
		font-size: 40rpx;
		color:#111;
		line-height: 1.6em;
		padding-bottom:30rpx;
		display: flex;
		.tag{
			transform: scale(0.8);
			transform-origin: left center;
			flex-shrink: 0;	
		}
		.font{
			padding-left:6rpx;
		}
	}
	.info{
		display: flex;
		align-items: center;
		color:#999;
		font-size: 28rpx;
		.item{
			padding-right: 20rpx;
		}
	}
	.content{
		padding:50rpx 0;
	}
	.count{
		color:#999;
		font-size: 28rpx;
	}
}
</style>
